{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>订单管理</title>
    <meta name="description" content="Responsive, Bootstrap, BS4">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimal-ui">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-barstyle" content="black-translucent">
    <link rel="apple-touch-icon" href="{% static '' %}aside/images/logo.png">
    <meta name="apple-mobile-web-app-title" content="Flatkit">
    <meta name="mobile-web-app-capable" content="yes">
    <link rel="shortcut icon" sizes="196x196" href="{% static '' %}aside/images/logo.png">
    <link rel="stylesheet" href="{% static '' %}aside/css/animate.css/animate.min.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/glyphicons/glyphicons.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/font-awesome/css/font-awesome.min.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/material-design-icons/material-design-icons.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/ionicons/css/ionicons.min.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/simple-line-icons/css/simple-line-icons.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/bootstrap/dist/css/bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="{% static '' %}aside/css/styles/app.min.css">
    <link rel="stylesheet" href="{% static '' %}aside/css/styles/font.css" type="text/css">
</head>
<body>
<div class="app" id="app">
<div id="aside" class="app-aside fade nav-dropdown black">
    <div class="navside dk" data-layout="column">
        <div class="navbar no-radius"><a href="/" class="navbar-brand">
            <div data-ui-include="'{% static '' %}aside/images/logo.svg'"></div>
            <img src="{% static '' %}aside/images/logo.png" alt="." class="hide"> <span class="hidden-folded inline">WanFeng</span></a></div>
        <div data-flex class="hide-scroll">
            <nav class="scroll nav-stacked nav-stacked-rounded nav-color">
                <ul class="nav" data-ui-nav>
                    <li><a href="{% url 'erp:cpanel' %}" class="b-danger"><span class="nav-icon text-white no-fade"><i class="ion-home"></i></span> <span class="nav-text">后台首页</span></a></li>
                    <li><a class="b-success"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-plus-circled"></i></span> <span class="nav-text">我的工作</span></a>
                        <ul class="nav-sub nav-mega nav-mega-3">
                            <li><a href="#"><span class="nav-text">开发基本信息</span></a></li>
                            <li><a href="#"><span class="nav-text">成本核算</span></a></li>
                            <li><a href="#"><span class="nav-text">违禁词查询</span></a></li>
                        </ul>
                    </li>
                    <li><a class="b-info"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-ios-photos"></i></span> <span class="nav-text">库存管理</span></a>
                        <ul class="nav-sub nav-mega">
                            <li><a href="#"><span class="nav-text">我的库存</span></a></li>
                            <li><a href="#"><span class="nav-text">所有库存</span></a></li>
                            <li><a href="#"><span class="nav-text">库存大全</span></a></li>
                            <li><a href="#"><span class="nav-text">在线商品库存</span></a></li>
                            <li><a href="#"><span class="nav-text">供应商管理</span></a></li>
                        </ul>
                    </li>
                    <li><a class="b-warning"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-checkmark-circled"></i></span> <span class="nav-text">订单管理</span></a>
                        <ul class="nav-sub">
                            <li><a class="p-l-1" href="{% url 'erp:order' %}"> <span class="nav-icon"><i class="ion-pie-graph"></i></span> <span class="nav-text">全部订单</span></a>
                            <li><a class="p-l-1" href="{% url 'erp:order' %}"> <span class="nav-icon"><i class="ion-pie-graph"></i></span> <span class="nav-text">已发货</span></a>

                            </li>
                            <li><a class="p-l-1"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon"><i class="ion-ios-person"></i></span> <span class="nav-text">人工处理</span></a>
                                <ul class="nav-sub nav-mega nav-mega-3">
                                    <li><a href="#"><span class="nav-text">有留言订单</span></a></li>
                                    <li><a href="#"><span class="nav-text">无对应SKU</span></a></li>
                                    <li><a href="#"><span class="nav-text">报关信息不全</span></a></li>
                                    <li><a href="#"><span class="nav-text">收货信息不全</span></a></li>
                                    <li><a href="#"><span class="nav-text">可合并订单</span></a></li>
                                </ul>
                            </li>
                            <li><a class="p-l-1"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon"><i class="ion-checkmark-circled"></i></span> <span class="nav-text">确定单号</span></a>
                                <ul class="nav-sub nav-mega">
                                    <li><a href="#"><span class="nav-text">申请单号</span></a></li>

                                </ul>
                            </li>
                            <li><a class="p-l-1"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon"><i class="ion-checkmark-circled"></i></span> <span class="nav-text">确定物流</span></a>
                                <ul class="nav-sub">
                                    <li><a href="#"><span class="nav-text">选择物流</span></a></li>

                                </ul>
                            </li>
                            <li><a class="p-l-1"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon"><i class="ion-android-print"></i></span> <span class="nav-text">等待打单</span></a>
                                <ul class="nav-sub">
                                    <li><a href="#"><span class="nav-text">待打单(有货)</span></a></li>
                                    <li><a href="#"><span class="nav-text">待打单(缺货)</span></a></li>
                                </ul>
                            </li>
                            <li><a class="p-l-1"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon"><i class="ion-information-circled"></i></span> <span class="nav-text">异常订单</span></a>
                                <ul class="nav-sub">
                                    <li><a href="#"><span class="nav-text">已搁置</span></a></li>
                                    <li><a href="#"><span class="nav-text">退款</span></a></li>
                                    <li><a href="#"><span class="nav-text">重新发包裹</span></a></li>
                                    <li><a href="#"><span class="nav-text">换面单</span></a></li>
                                </ul>
                            </li>

                        </ul>
                    </li>
                    <li><a class="b-default"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-android-bus"></i></span> <span class="nav-text">物流管理</span></a>
                        <ul class="nav-sub">
                            <li><a href="{% url 'erp:freightCalculate' %}"><span class="nav-text">运费计算</span></a></li>

                        </ul>
                    </li>
                    <li><a class="b-success"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-ios-cart"></i></span> <span class="nav-text">商品管理</span></a>
                        <ul class="nav-sub">
                            <li><a href="#"><span class="nav-text">开发产品列表</span></a></li>
                            <li><a href="#"><span class="nav-text">所有开发产品</span></a></li>
                            <li><a href="#"><span class="nav-text">产品库</span></a></li>
                            <li><a href="{% url 'erp:product' %}"><span class="nav-text">在线产品列表</span></a></li>

                        </ul>
                    </li>
                    <li><a class="b-warn"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-chatbubble-working"></i></span> <span class="nav-text">客服管理</span></a>
                        <ul class="nav-sub">
                            <li><a href="{% url 'erp:message' %}"><span class="nav-text">处理消息</span></a></li>
                            <li><a href="#"><span class="nav-text">重点关注</span></a></li>
                            <li><a href="#"><span class="nav-text">模板管理</span></a></li>
                        </ul>
                    </li>
                    <li><a class="b-danger"><span class="nav-caret"><i class="fa fa-caret-down"></i></span> <span class="nav-icon text-white no-fade"><i class="ion-social-yen"></i></span> <span class="nav-text">利润管理</span></a>
                        <ul class="nav-sub">
                            <li><a href="#"><span class="nav-text">财务总览</span></a></li>
                            <li><a href="#"><span class="nav-text">销售统计</span></a></li>
                            <li><a href="#"><span class="nav-text">支出管理</span></a></li>
                            <li><a href="#"><span class="nav-text">采购明细</span></a></li>
                        </ul>
                    </li>

                </ul>
            </nav>
        </div>
        <div data-flex-no-shrink>
            <div class="nav-fold dropup"><a data-toggle="dropdown">
                <div class="pull-left">
                    <div class="inline"><span class="avatar w-40 grey text-capitalize">{% if request.user.last_name %}{{ request.user.last_name }}{% else %}{{ request.user.username |slice:"3" }}{% endif %}</span></div>
                    <img src="{% static '' %}aside/images/a0.jpg" alt="..." class="w-40 img-circle hide"></div>
                <div class="clear hidden-folded p-x"><span class="block _500 text-muted">{% if request.user.first_name %}{{ request.user.first_name }}{% else %}{{ request.user.username }}{% endif %}</span>
                    <div class="progress-xxs m-y-sm lt progress">
                        <div class="progress-bar info" style="width: 15%"></div>
                    </div>
                </div>
            </a>
                <div class="dropdown-menu w dropdown-menu-scale"><a class="dropdown-item" href="{% url 'profile' %}#aboutme"><span>个人资料</span></a> <a class="dropdown-item" href="{% url 'changePassword' %}"><span>修改密码</span></a> <a class="dropdown-item" href="#"><span>收件箱</span></a> <a class="dropdown-item" href="#"><span>消息处理</span></a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="#">帮助?</a> <a class="dropdown-item" href="{% url 'signout' %}">退出</a></div>
            </div>
        </div>
    </div>
</div>
<div id="content" class="app-content box-shadow-z2 bg pjax-container" role="main">
<div class="app-header white bg b-b">
    <div class="navbar" data-pjax><a data-toggle="modal" data-target="#aside" class="navbar-item pull-left hidden-lg-up p-r m-a-0"><i class="ion-navicon"></i></a>
        <div class="navbar-item pull-left h5" id="pageTitle">订单管理</div>

        <ul class="nav navbar-nav pull-right">
            <li class="nav-item pos-stc-xs">
                <a class="nav-link clear" id="showSide" data-toggle="tooltip" data-placement="bottom" title="折叠/展开侧栏"><i class="fa fa-dedent fa-fw m-r-xs"></i></a>
            </li>
            <li class="nav-item pos-stc-xs">
                <a class="nav-link clear" data-toggle="tooltip" data-placement="bottom" title="全屏显示" data-ui-fullscreen data-target="fullscreen"><i class="fa fa-expand fa-fw m-r-xs"></i></a>
            </li>
            <li class="nav-item dropdown pos-stc-xs"><a class="nav-link clear" data-toggle="dropdown"><i class="ion-android-notifications-none w-24"></i> <span class="label up p-a-0 danger"></span></a>
                <div class="dropdown-menu pull-right w-xl animated fadeIn no-bg no-border no-shadow">
                    <div class="scrollable" style="max-height: 220px">
                        <ul class="list-group list-group-gap m-a-0">
                            <li class="list-group-item dark-white box-shadow-z0 b"><span class="pull-left m-r"><img src="{% static '' %}aside/images/a0.jpg" alt="..." class="w-40 img-circle"></span> <span class="clear block">新增订单［<a href="#" class="text-primary">78023645468911</a>］<br>
                    <small class="text-muted">10 分钟前</small></span></li>
                            <li class="list-group-item dark-white box-shadow-z0 b"><span class="pull-left m-r"><img src="{% static '' %}aside/images/a1.jpg" alt="..." class="w-40 img-circle"></span> <span class="clear block">产品SKU［32601740388］<a href="#" class="text-primary">缺货</a><br>
                    <small class="text-muted">2 小时前</small></span></li>
                            <li class="list-group-item dark-white text-color box-shadow-z0 b"><span class="pull-left m-r"><img src="{% static '' %}aside/images/a2.jpg" alt="..." class="w-40 img-circle"></span> <span class="clear block">订单［78023645468911］ 有<a href="#" class="text-primary">留言</a><br>
                    <small class="text-muted">1 天前</small></span></li>
                        </ul>
                    </div>
                </div>
            </li>
            <li class="nav-item dropdown"><a class="nav-link clear" data-toggle="dropdown"><span class="avatar w-32"><img src="{% static '' %}aside/images/a3.jpg" class="w-full rounded" alt="..."></span></a>
                <div class="dropdown-menu w dropdown-menu-scale pull-right"><a class="dropdown-item" href="{% url 'profile' %}#aboutme"><span>个人档案</span></a> <a class="dropdown-item" href="{% url 'changePassword' %}"><span>修改密码</span></a> <a class="dropdown-item" href="#"><span>收件箱</span></a> <a class="dropdown-item" href="#"><span>消息</span></a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="#">帮助?</a> <a class="dropdown-item" href="{% url 'signout' %}">退出</a></div>
            </li>
        </ul>
    </div>
</div>
<div class="app-footer white bg p-a b-t" style="position: fixed;">
    <div class="row" id="goodsInfoBox" style="display: none;">
        <a class="pull-right text-muted text-lg p-a-sm m-r-sm" id="closeGoodsInfoBox">×</a>
        <div class="col-sm-12">

            <div class="b-b b-success nav-active-success">
                <ul class="nav nav-tabs">
                    <li class="nav-item"><a class="nav-link active" href="#" data-toggle="tab" data-target="#tab-goods" aria-expanded="false">商品信息</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-stock" aria-expanded="false">库存信息</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-address" aria-expanded="true">收货地址</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-message" aria-expanded="true">买家留言</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-logistics" aria-expanded="true">物流信息</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-pay" aria-expanded="true">付款信息</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-profit" aria-expanded="true">订单利润</a></li>
                    <li class="nav-item"><a class="nav-link" href="#" data-toggle="tab" data-target="#tab-memo" aria-expanded="true">备注信息</a></li>
                </ul>
            </div>
            <div class="tab-content p-a m-b-md">
                <div class="tab-pane animated fadeIn text-muted active" id="tab-goods" aria-expanded="false">
                    <div class="table-responsive">
                    <table class="table table-bordered m-a-0">
                <thead>
                <tr>
                    <th>#</th>
                    <th>主图</th>
                    <th>报关信息</th>
                    <th>单价</th>
                    <th>数量</th>
                    <th>总价</th>
                    <th>利润</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>1</td>
                    <td><img src="http://g02.a.alicdn.com/kf/UT8tE2bXGJXXXagOFbXA.jpg_50x50.jpg" alt="星球大战光剑" class="w-48 img-responsive"/></td>
                    <td>玩具手表 / Toy Watch / $5.0 / 120（g） / </td>
                    <td>$25.89</td>
                    <td>1</td>
                    <td>$25.89</td>
                    <td>￥35</td>
                </tr>
                </tbody>
            </table>
                    </div>
                </div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-stock" aria-expanded="false">
                    <div class="table-responsive">
                    <table class="table table-bordered m-a-0">
                <thead>
                <tr>
                    <th>#</th>
                    <th>主图</th>
                    <th>SKU名称</th>
                    <th>仓库</th>
                    <th>进价</th>
                    <th>售价</th>
                    <th>利润</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>1</td>
                    <td><img src="http://g02.a.alicdn.com/kf/UT8tE2bXGJXXXagOFbXA.jpg_50x50.jpg" alt="星球大战光剑" class="w-48 img-responsive"/></td>
                    <td>星球大战光剑</td>
                    <td>上海仓</td>
                    <td>￥20</td>
                    <td>$25.89</td>
                    <td>￥35</td>
                </tr>
                </tbody>
            </table>
                    </div>
                </div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-address" aria-expanded="true">
                    <div class="table-responsive">
                    <table class="table table-bordered m-a-0">
                <thead>
                <tr>
                    <th>收件人</th>
                    <th>国家</th>
                    <th>城市</th>
                    <th>地址</th>
                    <th>邮编</th>
                    <th>电话</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>Rosa Maria Fiori Ferrer</td>
                    <td>SPAIN（西班牙</td>
                    <td>Badalona</td>
                    <td>avda/Marques de Mont-roig 132 piso 1 puerta 1</td>
                    <td>08918</td>
                    <td>669489517</td>
                </tr>
                </tbody>
            </table>
                    </div>
                </div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-message" aria-expanded="true">无</div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-logistics" aria-expanded="true">速卖通线上发货-中外运-西邮经济小包--上海仓</div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-pay" aria-expanded="true">
                    <div class="table-responsive">
                    <table class="table table-bordered m-a-0">
                <thead>
                <tr>
                    <th>下单时间</th>
                    <th>付款时间</th>
                    <th>剩余发货时间</th>

                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>2016-11-20 16:12</td>
                    <td>2016-11-22 23:55</td>
                    <td>剩余发货：4天17小时16</td>
                </tr>
                </tbody>
            </table>
                    </div>
                </div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-profit" aria-expanded="true">计算中...</div>
                <div class="tab-pane animated fadeIn text-muted" id="tab-memo" aria-expanded="true">订单备注</div>
            </div>
        </div>
    </div>


    <div class="pull-right text-sm text-muted"><a href="#" class="btn btn-icon btn-social rounded btn-social-colored red-600" id="showGoodsInfoBox" data-toggle="tooltip" data-placement="left" title="显示/隐藏订单商品信息面板"><i class="fa fa-instagram"></i> <i class="fa fa-instagram"></i></a></div>
    <span class="text-sm text-muted">WanFeng &copy; Copyright. Version 4.0.1</span>
</div>

<div class="app-body" style="padding-bottom: 8.125rem;">
<style>
    #order-color .p-y-md{padding-bottom:0;padding-top: 0;text-align: center;font-size: 0.625rem; color:#fff;}
</style>

<script>
    function formatCountry(country){if(country.loading){return country.text}var markup="<div class='select2-result-repository clearfix'>"+"<div class='select2-result-repository__avatar'><span class='label warning label-lg'>"+country.country_code+"</span></div>"+"<div class='select2-result-repository__meta'>"+"<div class='select2-result-repository__title'>"+country.country_name_cn+"</div>";if(country.country_name){markup+="<div class='select2-result-repository__description'>"+country.country_name+"</div>"}markup+="</div>"+"</div></div>";return markup};
    function formatCountrySelection(country){if(country.country_name_cn){return country.country_name_cn+' ('+country.country_name+')'}else{return country.text}};
    //简单格式化时间
    function formatDate(dt){
        dt = dt.split(' ')[0];
        dt = dt.replace('/','-');
        dt = dt.replace('/','-');
        dt = dt.replace('年','-');
        dt = dt.replace('月','-');
        dt = dt.replace('日','');
        return dt
    }

    //生成日期
    function getFormatDate(num){
        var d = new Date();
        var nowtime = new Date(d.getFullYear(), d.getMonth(),(d.getDate()-num));
        return formatDate(nowtime.toLocaleDateString())
    }
    //end
    //打印面单
    function printMb(orderid){
        //href="/static/aside/printMb.pdf"

        window.open('/static/aside/printMb.pdf');
        //alert('标记［'+orderid+'］已打印!');
        $('#modal-printMB').modal('show');
    }
</script>
<script>
    var addTimer = function () {
        var list = [],
                interval;

        return function (id, dateStr) {
            if (!interval)
                interval = setInterval(go, 1000);


            dateStr = dateStr.replace(/-/g,"/");

            var endDate = new Date(dateStr);
            var now = new Date();

            var leftTime = (endDate.getTime()-now.getTime())/1000;

            list.push({ ele: document.getElementById(id), time: leftTime });
        }

        function go() {
            for (var i = 0; i < list.length; i++) {
                list[i].ele.innerHTML = getTimerString(list[i].time ? list[i].time -= 1 : 0);
                if (!list[i].time)
                    list.splice(i--, 1);
            }
        }

        function getTimerString(time) {
            d = Math.floor(time / 86400),
                    h = Math.floor((time % 86400) / 3600),
                    m = Math.floor(((time % 86400) % 3600) / 60),
                    s = Math.floor(((time % 86400) % 3600) % 60);
            if (time>0)
                if (d>0)
                    return d + "天" + h + "小时" + m + "分" + s + "秒";
                else
                    return h + "小时" + m + "分" + s + "秒";

            else return "已到期";
        }
    } ();
</script>


<div class="padding">
<div class="box" id="orderList">


<div class="row p-a">
    <div class="col-sm-12 m-t-1">
        订单时间：
        <span class="label orange m-r-1 setDate" data-val="0"><a href="javascript:">全部</a></span>
        <span class="label m-r-1 white text-dark setDate" data-val="1"><a href="javascript:">今天</a></span>
        <span class="label m-r-1 white text-dark setDate" data-val="2"><a href="javascript:">昨天</a></span>
        <span class="label m-r-1 white text-dark setDate" data-val="3"><a href="javascript:">近7天</a></span>
        <span class="label m-r-1 white text-dark setDate" data-val="4"><a href="javascript:">近30天</a></span>
        <span class="label m-r-1 white text-dark setDate" data-val="5"><a href="javascript:">自定义</a></span>
    </div>

    <!--
    <div class="col-sm-12 m-t-1">
        颜色说明：
        <span class="label primary m-r-1"><a href="#">正常毛利</a></span>
        <span class="label m-r-1 accent "><a href="#">毛利过低</a></span>
        <span class="label m-r-1 warn"><a href="#">毛利过高</a></span>
        <span class="label m-r-1 info"><a href="#">有留言</a></span>
        <span class="label m-r-1 warning"><a href="#">无SKU</a></span>
        <span class="label m-r-1 danger"><a href="#">缺货</a></span>
        <span class="label m-r-1 success"><a href="#">待打印</a></span>
        <span class="label m-r-1 pink-500"><a href="#">收货信息不全</a></span>
        <span class="label m-r-1 danger"><a href="#">报关信息不全</a></span>
        <span class="label m-r-1 dark"><a href="#">可合并订单</a></span>
    </div>
    -->

</div>

<div class="row p-a" id="filterBox" style="display: none;">
    <div class="col-sm-12">
        平台渠道：
        <span class="label orange m-r-1"><a href="#">全部</a></span>
        <span class="label m-r-1 white text-dark"><a href="#">速卖通</a></span>
        <span class="label m-r-1 white text-dark"><a href="#">eBay</a></span>
    </div>
    <div class="col-sm-12 m-t-1">
        店铺账号：
        <span class="label orange m-r-1 setStore" data-val="0"><a href="javascript:">全部</a></span>
        <span class="label m-r-1 white text-dark setStore" data-val="diw zhang"><a href="javascript:">diw zhang</a></span>
        <span class="label m-r-1 white text-dark setStore" data-val="liu haishen"><a href="javascript:">liu haishen</a></span>
        <span class="label m-r-1 white text-dark setStore" data-val="hai sen store"><a href="javascript:">hai sen store</a></span>
        <span class="label m-r-1 white text-dark setStore" data-val="pughhappylife"><a href="javascript:">pughhappylife</a></span>
    </div>
    <div class="col-sm-12 m-t-1">
        热门国家：
        <span class="label orange m-r-1 setCountry" data-val="0"><a href="javascript:">全部</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="RU"><a href="javascript:">俄罗斯</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="BR"><a href="javascript:">巴西</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="ES"><a href="javascript:">西班牙</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="US"><a href="javascript:">美国</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="NL"><a href="javascript:">荷兰</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="PL"><a href="javascript:">波兰</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="FR"><a href="javascript:">法国</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="CZ"><a href="javascript:">捷克共和国</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="CA"><a href="javascript:">加拿大</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="CL"><a href="javascript:">智利</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="UK"><a href="javascript:">英国</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="IT"><a href="javascript:">意大利</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="BE"><a href="javascript:">比利时</a></span>
        <span class="label m-r-1 white text-dark setCountry" data-val="IL"><a href="javascript:">以色列</a></span>
    </div>
</div>


<div class="row p-a">
    <div class="col-sm-6">
        <select class="custom-select w-sm inline v-middle">
            <option value="0">选择物流</option>
            <option value="1">申请运单号</option>
            <option value="2">合并订单</option>
            <option value="3">虚拟发货</option>
            <option value="4">搁置订单</option>
            <option value="5">添加备注</option>
            <option value="6">导出Excel</option>
        </select>
        <button class="btn btn-sm dark text-white">批量操作</button>
        <button class="btn btn-sm dark text-white"><i class="fa fa-refresh"></i> 同步订单</button>
    </div>
    <form name="searchFrom" action="" id="searchFrom">
    <div class="col-sm-6">
        <div class="input-group">
                <input type="hidden" id="searchType" value="1"/>
            <div class="input-group-btn dropdown"><button type="button" class="btn white dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span id="searchTypeText">搜索类型</span> <span class="caret"></span></button><div class="dropdown-menu"><a class="dropdown-item setSearchType" href="javascript:" data-val="1">订单号</a> <a class="dropdown-item setSearchType" href="javascript:" data-val="2">包裹号</a><div class="divider"></div><a class="dropdown-item setSearchType" href="javascript:"  data-val="3">跟踪号</a> <a class="dropdown-item setSearchType" href="javascript:" data-val="4">SKU</a>  <a class="dropdown-item setSearchType" href="javascript:" data-val="5">买家账号</a>  <a class="dropdown-item setSearchType" href="javascript:" data-val="6">收件人</a> </div></div>
            <input type="text" class="form-control" name="keyword" id="keyword" placeholder="搜索">
                <span class="input-group-btn">
                <button class="btn white" type="button" id="btnSearch"><i class="fa fa-search"></i></button>
                <button class="btn white" type="button" data-toggle="tooltip" data-placement="bottom" title="展开/折叠筛选项目" id="filterBtn"><a href="#" class="" data-ui-toggle-class=""><i class="fa fa-angle-double-up text-danger none"></i><i class="fa fa-angle-double-down inline"></i></a></button>
                </span>

        </div>
    </div>
    </form>


            <input type="hidden" name="filterStore" id="filterStore" value="0"/>
            <input type="hidden" name="pageSize" id="pageSize" value="{{ pageSize }}"/>
            <input type="hidden" name="pageNo" id="pageNo" value="1"/>
            <input type="hidden" name="filterCountry" id="filterCountry" value="0"/>
            <input type="hidden" name="filterStartDate" id="filterStartDate" value="{{ startDate }}"/>
            <input type="hidden" name="filterEndDate" id="filterEndDate" value="{{ endDate }}"/>

</div>



<div class="table-responsive">
    <table class="table table-striped table-hover b-t">
        <thead>
        <tr>
            <th style="width:20px"><label class="md-check m-a-0">
                <input type="checkbox" id="action-toggle">
                <i class="green"></i></label></th>
            <th>订单编号</th>
            <th>订单金额(USD)</th>
            <th>利润</th>
            <th>国家</th>
            <th style="width: 188px;">时间</th>
            <th>物流方式</th>
            <th>状态</th>
            <th>店铺</th>
            <th style="width:160px">操作</th>
        </tr>
        </thead>
        <tbody id="OrderListBox">
        {% for order in orderData %}
        <tr data-val="{{ order.orderId }}" data-buyer="{{ order.buyerName }}|{{ order.buyerId }}">
            <td><label class="md-check m-a-0">
                <input type="checkbox" name="post[]">
                <i class="green"></i></label></td>
            <td><a href="javascript:" class="orderItem text-primary" >{{ order.orderId }}</a><br/>
                {% if order.memo %}<span class="label blue tooltips" data-toggle="tooltip" data-placement="bottom" title="{{ order.memo }}">备</span>{% endif %}
            </td>
            <td data-val="{{ order.orderCurrency }}">$ {{ order.orderAmount }}</td>
            <td> - </td>
            <td data-val="{{ order.countryCode }}"> {{ order.country }} </td>
            <td>下单：{{ order.orderTime }}<br>
            {% if order.payTime %}付款：{{ order.payTime }}<br>
                <span>剩余：</span><code id="leftTime-{{ order.orderId }}" ></code>
            <script>addTimer("leftTime-{{ order.orderId }}", '{{ order.leftTime }}');</script>{% endif %}
            </td>
            <td>{{ order.logistics }}</td>
            <td>{{ order.orderStatus }}</td>
            <td>{{ order.seller }}</td>
            <td class="text-right">
                <button class="btn btn-sm btn-icon white printMb tooltips" data-toggle="tooltip" data-placement="bottom" title="打印面单"><i class="fa fa-print"></i></button>
                <button class="btn btn-sm btn-icon white tooltips" data-toggle="tooltip" data-placement="bottom" title="备注订单"><i class="fa fa-flag" data-toggle="modal" data-target="#modal-memo"></i></button>
                <button class="btn btn-sm btn-icon white tooltips showOrderDetail" data-toggle="tooltip" data-placement="bottom" title="查看订单详情"><i class="fa fa-eye" data-toggle="modal" data-target="#modal-OrderDetail"></i></button>
                <button class="btn btn-sm btn-icon white tooltips" data-toggle="tooltip" data-placement="bottom" title="搁置订单"><i class="fa fa-remove" data-toggle="modal" data-target="#modal-gezhi"></i></button>
            </td>
        </tr>
        {% endfor %}

        </tbody>
    </table>
</div>


<footer class="light lt p-a navbar-fixed-bottom">
    <div class="row">
        <div class="col-sm-2 text-left"><small class="text-muted inline m-t-sm m-b-sm" id="pageTxt">1-{{ currentItem }} 共 {{ totalNum }} 条</small></div>
        <div class="col-sm-5 text-right text-center-xs">
            <ul class="pagination m-a-0" id="pageItem">
                <li><a href="javascript:"><i class="fa fa-chevron-left"></i></a></li>
                {% for pp in pageData %}
                    <li{% if pp.active %} class="active"{% endif %}><a href="#" data-val="{{ pp.link }}" class="pageItem">{{ pp.page }}</a></li>
                {% endfor %}

                <li><a href="javascript:"><i class="fa fa-chevron-right"></i></a></li>
            </ul>
        </div>
        <div class="col-sm-5 hidden-xs text-right">
            <button class="btn white">转到</button>
            <input type="text" name="jumpTo" id="jumpTo" class="w-xxs" style="margin-right: 3px; height: 30px;"><button class="btn white" id="btnJump">Go</button>
            <button class="btn white">每页</button>
            <select class="custom-select w-xs inline v-middle" name="selectPageSize" id="selectPageSize">
                <option value="30" {% ifequal pageSize '30' %}selected{% endifequal %}>30条</option>
                <option value="50" {% ifequal pageSize '50' %}selected{% endifequal %}>50条</option>
                <option value="100" {% ifequal pageSize '100' %}selected{% endifequal %}>100条</option>
                <option value="200" {% ifequal pageSize '200' %}selected{% endifequal %}>200条</option>
            </select>

        </div>
    </div>
</footer>
</div>
</div>


</div>
</div>


<div id="modal-OrderDetail" class="modal" data-backdrop="true">
    <div class="row-col h-v">
        <div class="row-cell v-m">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header p-b-0">
                        <h6 class="modal-title">包裹详情 <span class="orderId"></span>
                        <a data-dismiss="modal" class="pull-right text-muted text-lg m-r-sm">×</a>
                        </h6>
                    </div>
                    <div class="modal-body p-lg">
                        <div class="table-responsive"><table class="table table-bordered m-a-0"><thead><tr><th>卖家：<span class="orderSeller"></span></th><th>买家：<span class="orderBuyerId"></span></th><th>买家姓名/邮箱：<span class="orderBuyerName"></span>/<span class="orderBuyerEmail"></span>  </th><th>金额：<span class="orderAmount"></span></th></tr></thead></table></div>

                        <div class="row text-center m-t-1">
                            <div class="col-sm-2"><div class="box-color success pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已审核</div></div></div>
                            <div class="col-sm-2"><div class="box-color grey-300 pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已处理</div></div></div>
                            <div class="col-sm-2"><div class="box-color grey-300 pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已申请单号</div></div></div>
                            <div class="col-sm-2"><div class="box-color grey-300 pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已打拣货单</div></div></div>
                            <div class="col-sm-2"><div class="box-color grey-300 pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已打面单</div></div></div>
                            <div class="col-sm-2"><div class="box-color grey-300 pos-rlt"><span class="arrow right b-info"></span><div class="box-body">已发货</div></div></div>
                        </div>

                        <div class="row-col">
        <div class="col-sm-3 col-lg-2 b-r">
            <div class="p-y">
                <div class="nav-active-border left b-primary">
                    <ul class="nav nav-sm">
                        <li class="nav-item"><a class="nav-link block active" href="#" data-toggle="tab" data-target="#deliveryAddress">收货地址 <i class="fa fa-check text-success"></i></a></li>
                        <li class="nav-item"><a class="nav-link block" href="#" data-toggle="tab" data-target="#customsInformation">报关信息 <i class="fa fa-check text-success"></i></a></li>
                        <li class="nav-item"><a class="nav-link block" href="#" data-toggle="tab" data-target="#logisticsInformation">物流信息 <i class="fa fa-times text-danger"></i></a></li>
                        <li class="nav-item"><a class="nav-link block" href="#" data-toggle="tab" data-target="#commentInformation">备注信息</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-sm-9 col-lg-10 light bg">
            <div class="tab-content pos-rlt">
                <div class="tab-pane active" id="deliveryAddress">
                    <h6 class="p-a-md b-b _600 m-b-1">收货地址</h6>
                    <form role="form" class="orderAddressForm">
                        <div class="col-xs-6">
                                <div class="form-group row">
                                    <label for="contactNmae" class="col-sm-2 form-control-label p-r-0">收件人:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="contactNmae" value="">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="address1" class="col-sm-2 form-control-label">地址1:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="address1" value="">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="address2" class="col-sm-2 form-control-label">地址2:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="address2" value="">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="phone" class="col-sm-2 form-control-label">电话:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="phone" >
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="mobile" class="col-sm-2 form-control-label">手机:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="mobile" value="">
                                    </div>
                                </div>
                            </div>
                    <div class="col-xs-6">
                                <div class="form-group row">
                                    <label for="country" class="col-sm-2 form-control-label">国家:</label>
                                    <div class="col-sm-10">
                                        <select id="country" disabled name="country" class="form-control select2" data-ui-jp="select2" data-ui-options="{theme: 'bootstrap',ajax: {
    url: '/aliexpress/ajaxCountry/?t=1',
    dataType: 'json',
    delay: 250,
    data: function (params) {
      return {
        q: params.term,
        page: params.page
      };
    },
    processResults: function (data, params) {
      params.page = params.page || 1;

      return {
        results: data.items,
        pagination: {
          more: (params.page * 30) < data.total_count
        }
      };
    },
    cache: true
  },
  escapeMarkup: function (markup) { return markup; },
  minimumInputLength: 1,
  templateResult: formatCountry,
  templateSelection: formatCountrySelection}" style="width: 100%">
                                        <option value="US" selected>美国 (UNITED STATES)</option>
                                    </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="city" class="col-sm-2 form-control-label">城市:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="city" value="Mkalles">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="province" class="col-sm-2 form-control-label">省/州:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="province" value="Mkalles - Main Road">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="zipCode" class="col-sm-2 form-control-label">邮编:</label>
                                    <div class="col-sm-10">
                                        <input type="text" disabled class="form-control" id="zipCode" value="00000">
                                    </div>
                                </div>
                                <div class="row pull-right p-r-1 p-t-1">
                                    <button type="button" class="btn btn-xs primary rounded" id="btnEditOrderAddress"><i class="fa fa-pencil m-r-xs"></i> 编辑</button>
                                    <button type="button" class="btn btn-xs info rounded" disabled id="btnSaveOrderAddress"><i class="fa fa-save m-r-xs"></i> 保存</button>
                                </div>
                            </div>
                    </form>
                </div>
                <div class="tab-pane" id="customsInformation">
                    <h6 class="p-a-md b-b _600">报关信息</h6>
                    <div class="table-responsive">
                        <table class="table table-bordered m-a-0">
                            <thead>
                            <tr>
                                <th>SKU</th>
                                <th>报关信息</th>
                                <th>操作</th>

                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td><a href="#">32772649416</a></td>
                                <td>遥控玩具车 / Remote control toy car / $12.0 / 400（g） / </td>
                                <td><a href="#">编辑</a></td>

                            </tr>
                            <tr>
                                <td><a href="#">32772649416</a></td>
                                <td>遥控玩具车 / Remote control toy car / $12.0 / 400（g） / </td>
                                <td><a href="#">编辑</a></td>

                            </tr>
                            <tr>
                                <td><a href="#">32772649416</a></td>
                                <td>遥控玩具车 / Remote control toy car / $12.0 / 400（g） / </td>
                                <td><a href="#">编辑</a></td>

                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="tab-pane" id="logisticsInformation">
                    <h6 class="p-a-md b-b _600">物流信息</h6>
                    <form role="form" class="p-a-md">
                        <div class="form-group row">
                                    <label for="inputEmail3" class="col-sm-3 form-control-label text-right">买家指定邮寄方式:</label>
                                    <div class="col-sm-9">
                                        <p class="form-control-label">AliExpress Standard Shipping</p>
                                    </div>
                                </div>
                        <div class="form-group row">
                                    <label for="inputEmail3" class="col-sm-3 form-control-label text-right">物流方式:</label>
                                    <div class="col-sm-9">
                                        <select class="form-control c-select">
                                            <option>燕文-中邮上海挂号小包</option>
                                            <option>燕文-瑞典邮政挂号小包(含电)</option>
                                            <option>燕文-土耳其邮政挂号小包(含电)</option>
                                        </select>
                                    </div>
                                </div>
                        <div class="form-group row">
                                    <label for="inputEmail3" class="col-sm-3 form-control-label text-right">获取单号方式:</label>
                                    <div class="col-sm-9">
                                        <p class="form-control-label">手动上传</p>
                                    </div>
                                </div>
                        <p class="text-center text-info"><a href="#">配置自动物流规则</a></p>
                    </form>
                </div>
                <div class="tab-pane" id="commentInformation">
                    <h6 class="p-a-md b-b _600">备注信息</h6>
                    <div class="table-responsive">
                        <table class="table table-bordered m-a-0">
                            <thead>
                            <tr>
                                <th>内容</th>
                                <th>时间</th>
                                <th>类型</th>
                                <th>操作人</th>
                                <th>操作</th>

                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                </div>

            </div>
        </div>
    </div>

                        <div class="row">
                            <div class="table-responsive">
                        <table class="table table-bordered m-a-1">
                            <thead>
                            <tr>
                                <th>订单号</th>
                                <th style="width:212px;">商品信息</th>
                                <th>商品标题</th>
                                <th>商品SKU配对</th>

                            </tr>
                            </thead>
                            <tbody class="childOrder">
                            <tr>
                                <td><a href="#">80809223995454</a></td>
                                <td><img src="http://g02.a.alicdn.com/kf/UT8V5bLXNFaXXagOFbX9.jpg_50x50.jpg" class="w-48 img-responsive pull-left m-r" alt=""/>
                                <div class="clear">
                                    <span class="m0">32772649416&nbsp;x&nbsp;<span class="label rounded danger">8</span></span>
                                    <br/>
                                    <span class="m0">USD 10.23</span><br/>
                                    <span class="m0">Color：Gold</span>
                                </div>

                                </td>
                                <td>遥控玩具车 / Remote control toy car / $ 12.0 / 400（g） / </td>
                                <td><button class="md-btn md-raised m-b-sm w-xs blue">配对</button></td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-sm info p-x-md" data-dismiss="modal">拆分</button>
                        <button type="button" class="btn btn-sm info p-x-md" data-dismiss="modal">申请运单号</button>
                        <button type="button" class="btn btn-sm info p-x-md" data-toggle="modal" data-target="#modal-gezhi">搁置</button>
                        <button type="button" class="btn btn-sm info p-x-md" data-dismiss="modal">备注</button>
                        <button type="button" class="btn btn-sm info-white p-x-md" data-dismiss="modal">关闭</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div id="modal-memo" class="modal black-overlay" data-backdrop="false">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">备注订单 <a data-dismiss="modal" class="pull-right text-muted text-lg p-a-sm m-r-sm">×</a></h5>

                </div>
                    <div class="modal-body text-center p-lg m-l-1 m-r-3">
                        <form role="form">

                            <div class="form-group row">
                                <label for="memoType" class="col-sm-2 form-control-label">类型：</label>
                                <div class="col-sm-10">
                                    <select class="form-control c-select" name="memoType" id="memoType">
                                        <option value="1">拣货说明</option>
                                        <option value="2">客服备注</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="memoContent" class="col-sm-2 form-control-label">内容：</label>
                                <div class="col-sm-10">
                                    <textarea id="memoContent" name="memoContent" class="form-control" rows="4"></textarea>
                                </div>
                            </div>
                            <div class="form-group row m-t-md">
                                <div class="col-sm-offset-2 col-sm-12">
                                    <button type="button" class="btn dark-white p-x-md" data-dismiss="modal">取消</button>
                                    <button type="submit" class="btn dark p-x-md" data-dismiss="modal">提交</button>
                                </div>
                            </div>
                        </form>
                    </div>

            </div>
        </div>
    </div>

<div id="modal-printMB" class="modal" data-backdrop="true">
    <div class="row-col h-v">
        <div class="row-cell v-m">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">打印面单</h5>
                    </div>
                    <div class="modal-body text-center p-lg">
                        <p>生成打印面单成功，标记为已打印？</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn dark-white p-x-md" data-dismiss="modal">取消</button>
                        <button type="button" class="btn dark p-x-md" data-dismiss="modal">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div id="modal-DiyDate" class="modal" data-backdrop="true">
    <div class="row-col h-v">
        <div class="row-cell v-m">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">自定义日期</h5>
                    </div>
                    <div class="modal-body text-center p-lg">

                        从：

                        <div class="form-group">
                    <div class="input-group date" data-ui-jp="datetimepicker" data-ui-options="{
                format: 'YYYY-MM-DD',
                icons: {
                  time: 'fa fa-clock-o',
                  date: 'fa fa-calendar',
                  up: 'fa fa-chevron-up',
                  down: 'fa fa-chevron-down',
                  previous: 'fa fa-chevron-left',
                  next: 'fa fa-chevron-right',
                  today: 'fa fa-screenshot',
                  clear: 'fa fa-trash',
                  close: 'fa fa-remove'
                }
              }">
                        <input type="text" id="startDate" name="startDate" class="form-control">
                        <span class="input-group-addon"><span class="fa fa-calendar"></span></span></div>
                </div>

                        到：

                        <div class="form-group">
                    <div class="input-group date" data-ui-jp="datetimepicker" data-ui-options="{
                format: 'YYYY-MM-DD',
                icons: {
                  time: 'fa fa-clock-o',
                  date: 'fa fa-calendar',
                  up: 'fa fa-chevron-up',
                  down: 'fa fa-chevron-down',
                  previous: 'fa fa-chevron-left',
                  next: 'fa fa-chevron-right',
                  today: 'fa fa-screenshot',
                  clear: 'fa fa-trash',
                  close: 'fa fa-remove'
                }
              }">
                        <input type="text" id="endDate" name="endDate" class="form-control">
                        <span class="input-group-addon"><span class="fa fa-calendar"></span></span></div>
                </div>


                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn dark-white p-x-md" data-dismiss="modal">取消</button>
                        <button type="button" class="btn dark p-x-md" data-dismiss="modal" id="btnDiyDate">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div id="modal-gezhi" class="modal" data-backdrop="true">
    <div class="row-col h-v">
        <div class="row-cell v-m">
            <div class="modal-dialog modal-sm">
                <div class="modal-content warning">
                    <div class="modal-header">
                        <h5 class="modal-title">搁置订单</h5>
                    </div>
                    <div class="modal-body text-center p-lg">
                        <p>您确定要搁置此订单？</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn dark-white p-x-md" data-dismiss="modal">取消</button>
                        <button type="button" class="btn dark p-x-md" data-dismiss="modal">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="switcher">
    <div class="switcher dark-white" id="sw-theme"><a href="#" data-ui-toggle-class="active" data-ui-target="#sw-theme" class="dark-white sw-btn"><i class="fa fa-gear text-muted"></i></a>
        <div class="box-header"><a href="{% url 'buy' %}" class="btn btn-xs rounded danger pull-right">BUY</a> <strong>主题设置</strong></div>
        <div class="box-divider"></div>
        <div class="box-body">
            <p id="settingLayout" class="hidden-md-down">
                <label class="md-check m-y-xs" data-target="folded">
                    <input type="checkbox">
                    <i></i> <span>折叠</span></label><br/>
                <label class="m-y-xs pointer" data-ui-fullscreen data-target="fullscreen"><span class="fa fa-expand fa-fw m-r-xs"></span> <span>全屏</span></label>
            </p>
            <p>Colors:</p>
            <p data-target="color">
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="primary">
                    <i class="primary"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="accent">
                    <i class="accent"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="warn">
                    <i class="warn"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="success">
                    <i class="success"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="info">
                    <i class="info"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="warning">
                    <i class="warning"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-md">
                    <input type="radio" name="color" value="danger">
                    <i class="danger"></i></label>
            </p>
            <p>Themes:</p>
            <div data-target="bg" class="clearfix">
                <label class="radio radio-inline m-a-0 ui-check ui-check-lg">
                    <input type="radio" name="theme" value="">
                    <i class="light"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-lg">
                    <input type="radio" name="theme" value="grey">
                    <i class="grey"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-lg">
                    <input type="radio" name="theme" value="dark">
                    <i class="dark"></i></label>
                <label class="radio radio-inline m-a-0 ui-check ui-check-color ui-check-lg">
                    <input type="radio" name="theme" value="black">
                    <i class="black"></i></label>
            </div>
        </div>
    </div>
</div>
</div>
<script src="{% static '' %}aside/scripts/app.js"></script>
</body>
</html>